<!doctype html>
<meta charset="utf-8">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<html>
<svg width="100" viewBox="0 0 200 400">
  <title>Mixed Scripts and Writing Modes</title>
  <style type="text/css">
    svg {
        font: 20px sans-serif;
        stroke-width: 2px;
    }
  </style>
  <g color="darkGreen" text-anchor="start">
    <g id="sample" fill="currentColor" writing-mode="tb">
      <text x="1em" y="2em">您好SVG</text>
    </g>
  </g>
</svg>
<script>
  var html = document.documentElement;
  var positions = [];
  var textElement = document.querySelector('text');
  for (var i=0; i<5; i++)
      positions.push(textElement.getStartPositionOfChar(i).x);
  html.style.zoom = 2;
  for (var i=0; i<5; i++) {
      newPos = textElement.getStartPositionOfChar(i).x;
      test(function () {
          assert_approx_equals(newPos, positions[i], 2);
      }, "Position of character index " + i + " unaffected by zoom level");
  }
  html.style.zoom = 1;
</script>
<div id="log"></div>
